﻿@inherits CavLayoutBase
<Layout Style="min-height:100vh;">
    <Sider Collapsible CollapsedWidth="CollapsedWidth" Collapsed=@Collapsed 
           OnCollapse=@OnCollapse NoTrigger Breakpoint="@BreakpointType.Lg"
           Style="overflow: auto; height: 100vh; position: fixed; left: 0;">
        <div class="logo" align="center">
            <img src="@LogoImgSrc" height="32" />
        </div>
        <CavMenu InlineCollapsed="@Collapsed" @bind-BreadcrumbItemCav="BreadcrumbItemCav"></CavMenu>
    </Sider>
    <Layout Style="@HeaderStyle">
        <Header Style="@UserConfig.HeaderStyle">
            @if (Collapsed)
            {
                <Icon Type="menu-unfold" Theme="outline" Class="trigger" OnClick="Toggle" />
            }
            else
            {
                <Icon Type="menu-fold" Theme="outline" Class="trigger" OnClick="Toggle" />
            }
            <div style="float:right;margin-right:20px;">
                <CavPopover></CavPopover>
            </div>
        </Header>
        <div style="margin: 12px 16px;">
            <CavBreadcrumb BreadcrumbItemCav="@BreadcrumbItemCav"></CavBreadcrumb>
        </div>
        <Content Style="@UserConfig.ContentStyle">
            @Body
        </Content>
        <CavFooter></CavFooter>
    </Layout>
</Layout>
<style>
    .trigger {
        font-size: 18px;
        line-height: 64px;
        padding: 0 24px;
        cursor: pointer;
        transition: color 0.3s;
    }
    .trigger:hover {
        color: #1890ff;
    }
    .logo {
        height: 32px;
        margin: 16px;
    }

</style>